 <template>
  <div class='container'>
    <el-dialog
      title="预览文章"
      :visible ="PVisible"
      @close = "closeFn"
        width="60%">
      <div>
        <h2> {{Pdata.title}}</h2>
        <div style=" padding-left:10px ;">
          <span>{{Time(Pdata.createTime)}}</span> <span>超级管理员1222</span> <i class="el-icon-view"></i> <span>{{Pdata.visits}}</span>
        </div>
        <div class="content" v-html="Pdata.articleBody">
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import dayjs from 'dayjs'
export default {
  props: {
    PVisible: {
      type: Boolean
    },
    Pdata: {
      type: Object,
      required: true
    }
  },
  methods: {
    closeFn () {
      this.$emit('update:PVisible', false)
    },
    Time (data) {
      return dayjs(data).format('YYYY-MM-DD HH:mm:ss')
    }
  }
}
</script>

<style scoped lang='less'>
span {
  padding: 0 5px;
}
.content {
  background: #f5f5f5;
  margin-top: 20px;
  padding: 10px;
  border-top: 1px dashed #ccc;
}
</style>
